<template>
    <el-container :class="container">
        <el-main>
            <el-card class="box-card">
                <headerTemplate slot="header" ref="header"
                                :table-ref="tableOptions.ref"
                                :toolbar_buttons="headerOption.toolbar_buttons"
                                :toolbar_filter="headerOption.toolbar_filter"
                                :searchForm="searchForm"
                                @event="handleHeaderEvent">
                    <template slot="right_search">
                        <el-select v-model="searchForm.audit_state" placeholder="请选择"
                                   class="w100" clearable @change="getList(true)"
                                   style="margin-right: 5px;">
                            <el-option v-for="(item, index) in stateList"
                                       :key="index" :label="item.label" :value="item.value" />
                        </el-select>
                    </template>
                </headerTemplate>
                <div class="card_content">
                    <vxeTableTemplate :data="dataList" :options.sync="tableOptions"
                                      @event="handleTableEvent" />
                </div>
            </el-card>
        </el-main>
    </el-container>
</template>

<script>
import { mapState } from "vuex";
import provide from "@common/mixins/provide";
import poiApi from "@common/api/poiApi";
import common from "@jxc/utils/common";
import clothing from "@jxc/utils/clothing";
import SaleOrderForm from "../sale/components/SaleOrderForm";
import SaleReturnBillForm from "../sale/components/SaleReturnBillForm";
import InvoiceForm from "../fin/dialog/InvoiceForm";
import ReceivePayForm from "../fin/dialog/ReceivePayForm";
import BuyOrderForm from "../buy/components/BuyOrderForm";

export default {
    extends: provide,
    name: "JxcSaleOrderList",
    props: {
        type: {
            type: String,
            default: 'JxcSaleOrder',
        },
        container: {
            type: String,
            default: 'jxc_sale_order_container',
        },
    },
    data() {
        const _this = this;
        return {
            headerOption: {
                toolbar_buttons: [
                    {
                        id: "refresh",
                        icon: "el-icon-refresh-right",
                        show: true,
                        method: () => {
                            _this.getList();
                        },
                    },
                    {
                        id: "add",
                        icon: "fa fa-plus",
                        type: "primary",
                        show: true,
                        permission: "jxc:saleOrder:save",
                        filter() {
                            return _this.type === 'JxcSaleOrder';
                        },
                        method: () => {
                            _this.openDialog(null, 'add');
                        },
                    },
                    {
                        id: "edit",
                        icon: "fa fa-pencil",
                        type: "success",
                        show: true,
                        permission: "jxc:saleOrder:save",
                        filter() {
                            return _this.type === 'JxcSaleOrder';
                        },
                        method: () => {
                            _this.openDialog(null, 'edit');
                        },
                    },
                    {
                        id: "delete",
                        icon: "fa fa-trash-o",
                        type: "danger",
                        show: true,
                        permission: "jxc:saleOrder:delete",
                        filter() {
                            return _this.type === 'JxcSaleOrder';
                        },
                        method: () => {
                            _this.deleteConfirm();
                        },
                    },
                    {
                        id: "audit",
                        label: '审核',
                        icon: "el-icon-top-right",
                        class: 'audit_btn',
                        show: true,
                        permission: "jxc:saleOrder:audit",
                        filter() {
                            return _this.type === 'JxcSaleOrder';
                        },
                        method: () => {
                            _this.changeAuditState('audit');
                        },
                    },
                    {
                        id: "reAudit",
                        label: '反审',
                        icon: "el-icon-bottom-left",
                        class: 're_audit_btn',
                        show: true,
                        permission: "jxc:saleOrder:reAudit",
                        filter() {
                            return _this.type === 'JxcSaleOrder';
                        },
                        method: () => {
                            _this.changeAuditState('reAudit');
                        },
                    },
                    {
                        id: "gen_stock_out_bill",
                        type: "success",
                        show: true,
                        label: '生成出库单',
                        permission: "jxc:saleOrder:genOutBill",
                        filter() {
                            return _this.type === 'JxcSaleOrder';
                        },
                        method: () => {
                            _this.genOutBill();
                        },
                    },
                    {
                        id: "sale2buy",
                        label: '以销定购',
                        type: 'success',
                        show: true,
                        filter() {
                            return _this.type === 'JxcSaleOrder';
                        },
                        method: () => {
                            _this.openSale2BuyDialog();
                        },
                    },
                    {
                        id: "export",
                        type: "warning",
                        icon: "el-icon-download",
                        label: '导出',
                        class: 'export_btn',
                        show: true,
                        permission: "jxc:saleOrder:export",
                        btnType: 'dropdown',
                        dropdownItems: [
                            { command: 'includeDetail', label: '导出单据（含明细）' },
                            { command: 'noDetail', label: '导出单据（不含明细）' },
                            { command: 'saleOrder', label: '销售单' },
                        ],
                        filterDropdownItem(item) {
                            if (item.command === 'saleOrder') {
                                return clothing.isClothing(_this.setting);
                            }
                            return true;
                        },
                        filter() {
                            return _this.type === 'JxcSaleOrder';
                        },
                        method: command => {
                            _this.handleExportEvent(command);
                        },
                    },
                    {
                        id: "print",
                        icon: 'el-icon-printer',
                        show: true,
                        label: '打印',
                        class: 'print_btn',
                        permission: "jxc:saleOrder:print",
                        btnType: 'print',
                        printType: 'saleOrder',
                        dropdownItems: [
                            {
                                command: 'printTemplate',
                                label: '打印模板',
                                divided: true,
                                icon: 'el-icon-s-tools',
                                permission: 'jxc:saleOrder:printTemplate'
                            },
                            {
                                command: 'printItem',
                                label: '打印配置项',
                                icon: 'el-icon-s-tools',
                                permission: 'jxc:saleOrder:printItem'
                            },
                        ],
                        filter() {
                            return _this.type === 'JxcSaleOrder';
                        },
                        method: command => {
                            _this.handlePrintEvent(command);
                        },
                    },
                ],
                toolbar_filter: [
                    { type: "text", field: "code", label: "销售单号" },
                    { type: "daterange", field: "order_date", label: "销售日期", style: { width: '200px' }, },
                    {
                        type: "selectBottom",
                        field: "client_sid",
                        label: "客户",
                        props: {
                            type: 'clientsDrawer',
                            options: {
                                placeholder: '选择客户',
                            },
                        },
                    },
                    {
                        type: "daterange",
                        field: "client_req_delivery_date",
                        label: "要求发货时间",
                        style: { width: '200px' },
                    },
                    {
                        type: "daterange",
                        field: "client_req_receive_date",
                        label: "要求到货时间",
                        style: { width: '200px' },
                    },
                    {
                        type: "daterange",
                        field: "pre_delivery_date",
                        label: "预计发货日期",
                        style: { width: '200px' },
                    },
                    {
                        type: "daterange",
                        field: "real_delivery_date",
                        label: "实际发货日期",
                        style: { width: '200px' },
                    },
                    {
                        type: "daterange",
                        field: "audit_date",
                        label: "审核日期",
                        style: { width: '200px' },
                    },
                ],
            },
            searchForm: {
                audit_state: '',
            },
            dataList: [],
            selectionList: [],
            tableOptions: {
                ref: `${ _this.type }Table`,
                container: `.${ _this.container }`,
                multiSelect: _this.type === 'JxcSaleOrder',
                showSummary: true,
                summaryArray: [ "qty", "amount", "pre_freight", "real_freight", "total_amount", 'tax_amount',
                    "ignore_amount", "should_receive_amount", 'invoice_amount', "received_amount", "un_receive_amount",
                    "return_qty", "return_amount", 'total_cost' ],
                columns: [
                    {
                        label: "状态",
                        prop: "audit_state",
                        align: "center",
                        width: 60,
                        formatter: (row) => {
                            if (_this.$utils.isNotEmpty(row.audit_state) && row.audit_state === 1) {
                                return '已审核';
                            }
                            return '待审核';
                        },
                    },
                    {
                        label: "出库单",
                        prop: "out_bill",
                        align: "center",
                        width: 70,
                        formatter: (row) => {
                            if (_this.$utils.isNotEmpty(row.out_bill)) {
                                if (row.out_bill === 1) {
                                    return '部分生成';
                                }
                                if (row.out_bill === 2) {
                                    return '全部生成';
                                }
                            }
                            return '未生成';
                        },
                    },
                    {
                        label: "对账",
                        prop: "gen_finance",
                        align: "center",
                        width: 70,
                        formatter: (row) => {
                            if (_this.$utils.isNotEmpty(row.gen_finance) && row.gen_finance === 1) {
                                return '已生成';
                            }
                            return '未生成';
                        },
                    },
                    {
                        label: "销售单号",
                        prop: "code",
                        align: "center",
                        minWidth: 150,
                    },
                    {
                        label: "销售日期",
                        prop: "order_date",
                        align: "center",
                        minWidth: 90,
                    },
                    {
                        label: "客户订单号",
                        prop: "client_order_code",
                        align: "center",
                        minWidth: 150,
                    },
                    {
                        label: "客户",
                        prop: "client_display",
                        align: "center",
                    },
                    {
                        label: "合计数量",
                        prop: "qty",
                        align: "center",
                    },
                    {
                        label: "合计金额",
                        prop: "amount",
                        align: "center",
                        formatter: (row, column, scope) => _this.formatterAmount(row, column, scope, 2),
                    },
                    {
                        label: "预估运费",
                        prop: "pre_freight",
                        align: "center",
                        formatter: (row, column, scope) => _this.formatterAmount(row, column, scope, 2),
                    },
                    {
                        label: "实付运费",
                        prop: "real_freight",
                        align: "center",
                        formatter: (row, column, scope) => _this.formatterAmount(row, column, scope, 2),
                    },
                    {
                        label: "销售方包邮",
                        prop: "free_shipping",
                        align: "center",
                        formatter(row) {
                            if (row.free_shipping === 1) {
                                return '是';
                            }
                            return '否';
                        },
                    },
                    {
                        label: "订单金额",
                        prop: "total_amount",
                        align: "center",
                        formatter: (row, column, scope) => _this.formatterAmount(row, column, scope, 2),
                    },
                    {
                        label: "税额",
                        prop: "tax_amount",
                        align: "center",
                        formatter: (row, column, scope) => _this.formatterAmount(row, column, scope, 2),
                    },
                    {
                        label: "抹零",
                        prop: "ignore_amount",
                        align: "center",
                        formatter: (row, column, scope) => _this.formatterAmount(row, column, scope, 2),
                    },
                    {
                        label: "应收金额",
                        prop: "should_receive_amount",
                        align: "center",
                        formatter: (row, column, scope) => _this.formatterAmount(row, column, scope, 2),
                    },
                    {
                        label: "已开票金额",
                        prop: "invoice_amount",
                        align: "center",
                        formatter: (row, column, scope) => _this.formatterAmount(row, column, scope, 2),
                    },
                    {
                        label: "已收金额",
                        prop: "received_amount",
                        align: "center",
                        formatter: (row, column, scope) => _this.formatterAmount(row, column, scope, 2),
                    },
                    {
                        label: "未收金额",
                        prop: "un_receive_amount",
                        align: "center",
                        formatter: (row, column, scope) => _this.formatterAmount(row, column, scope, 2),
                    },
                    {
                        label: "总成本",
                        prop: "total_cost",
                        align: "center",
                        formatter: (row, column, scope) => _this.formatterAmount(row, column, scope, 2),
                    },
                    {
                        label: "毛利率",
                        prop: "gross_profit_rate",
                        align: "center",
                        width: 70,
                        formatter(row) {
                            let rate = 0;
                            if (_this.$utils.isNotEmpty(row.gross_profit_rate)) {
                                rate = _this.$utils.accMul(row.gross_profit_rate, 100);
                            }
                            rate = Number(Number(rate).toFixed(2));
                            return `${ rate }%`;
                        },
                    },
                    {
                        label: "要求发货时间",
                        prop: "client_req_delivery_date",
                        align: "center",
                        width: 100,
                    },
                    {
                        label: "要求到货时间",
                        prop: "client_req_receive_date",
                        align: "center",
                        width: 100,
                    },
                    {
                        label: "发货方式",
                        prop: "delivery_mode",
                        align: "center",
                        width: 90,
                    },
                    {
                        label: "业务员",
                        prop: "salesman_name",
                        align: "center",
                    },
                    // {
                    //     label: "利润率(%)",
                    //     prop: "profit_rate",
                    //     align: "center",
                    // },
                    {
                        label: "退货数量",
                        prop: "return_qty",
                        align: "center",
                    },
                    {
                        label: "退货金额",
                        prop: "return_amount",
                        align: "center",
                        formatter: (row, column, scope) => _this.formatterAmount(row, column, scope, 2),
                    },
                    {
                        label: "备注",
                        prop: "note_info",
                        align: "left",
                    },
                ],
                operates: {
                    fixed: "right",
                    count: _this.type === 'JxcReceivable' ? 2 : 5,
                    list: [
                        {
                            id: "detail",
                            icon: "fa fa-info-circle",
                            type: "warning",
                            size: "mini",
                            show: true,
                            tooltip: {
                                content: "详情",
                            },
                            method: (index, row) => {
                                _this.openDialog(row, 'detail');
                            },
                        },
                        {
                            id: "edit",
                            icon: "fa fa-pencil",
                            type: "success ",
                            size: "mini",
                            show: true,
                            permission: "jxc:saleOrder:save",
                            tooltip: {
                                content: "编辑",
                            },
                            filter(row) {
                                return _this.type === 'JxcSaleOrder' && row.audit_state === 0;
                            },
                            method: (index, row) => {
                                _this.openDialog(row, 'edit');
                            },
                        },
                        {
                            id: "del",
                            icon: "fa fa-trash-o",
                            type: "danger",
                            size: "mini",
                            show: true,
                            permission: "jxc:saleOrder:delete",
                            tooltip: {
                                content: "删除",
                            },
                            filter(row) {
                                return _this.type === 'JxcSaleOrder' && row.audit_state === 0;
                            },
                            method: (index, row) => {
                                _this.deleteConfirm(row);
                            },
                        },
                        {
                            id: "recviced",
                            type: "primary",
                            size: "mini",
                            show: true,
                            permission: "jxc:saleOrder:received|jxc:receivable:received",
                            tooltip: {
                                content: "录入收款",
                            },
                            svg: {
                                iconClass: 'icon-money',
                            },
                            method: (index, row) => {
                                _this.openReceiveDialog(row);
                            },
                        },
                        {
                            id: "reGen",
                            icon: "el-icon-document-copy",
                            type: "success",
                            size: "mini",
                            show: true,
                            tooltip: {
                                content: "再次下单",
                            },
                            filter(row) {
                                if (_this.type === 'JxcReceivable') {
                                    return false;
                                }
                                return row.dr === 0;
                            },
                            method: (index, row) => {
                                _this.openDialog(row, 'reGen');
                            },
                        },
                    ],
                },
                pagination: {
                    pageIndex: 1,
                },
            },
        };
    },
    computed: {
        ...mapState('jxc', [ 'stateList', 'invoiceTypeList', 'setting' ]),
    },
    mounted() {
        this.init();
    },
    methods: {
        async init() {
            const _this = this;
            _this.$bus.$off(`refresh${_this.type}`);
            _this.$bus.$on(`refresh${_this.type}`, () => {
                _this.getList(true);
            });
            await _this.storeDispatch('jxc/initSetting');
            _this.getList(true);
        },
        handleHeaderEvent(event) {
            const _this = this;
            _this.searchForm = $.extend({}, _this.searchForm, event.searchForm);
            if (event.type === "search") {
                _this.getList(true);
            } else if (event.type === "refresh") {
                _this.getList(true);
            }
        },
        getList(query) {
            const _this = this;
            if (query) {
                _this.tableOptions = _this.resetTablePagination(_this.tableOptions);
            }
            let queryData = _this.getQueryParams(_this.tableOptions, _this.searchForm);
            _this.fetchData(_this.$api.API_FindJxcSaleOrders, queryData).then(result => {
                _this.dataList = result.data || [];
                _this.tableOptions = _this.setTableTotal(_this.tableOptions, result);
            }).catch(() => {
            });
        },
        handleTableEvent(event) {
            if (event.type === 'page') {
                this.getList();
                return;
            }
            if (event.type === 'selectionChange') {
                this.selectionList = event.value;
            }
        },
        openDialog(row, type) {
            const _this = this;
            if (type === 'edit' && row == null) {
                if (!_this.checkSelection(_this.selectionList, false)) {
                    return;
                }
                row = _this.selectionList[0];
            }
            if (!row) {
                row = {};
            }
            if (type === 'edit' && row.gen_finance === 1) {
                _this.$message.error(`销售订单：${ row.code } 已生成对账，无法再编辑！`);
                return;
            }
            if (type === 'edit' && row.audit_state === 1) {
                _this.$message.error(`销售订单：${ row.code } 已审核，请先反审核再编辑！`);
                return;
            }
            let detail = type !== 'reGen' && (type === 'detail' || row.audit_state === 1);
            const query = {};
            if (_this.$utils.isNotEmpty(row.sid)) {
                query.sid = row.sid;
            }
            _this.$router.push({
                path: `/jxcSaleOrderDetail${(type==='reGen'?'New':(detail?'View':''))}`,
                query,
            });
            // _this.$dialog({
            //     title: '销售订单',
            //     width: '1200px',
            //     component: {
            //         value: SaleOrderForm,
            //         props: {
            //             detail,
            //             row,
            //             reGen: type === 'reGen',
            //         },
            //     },
            //     hideConfirmBtn: detail,
            //     confirmed() {
            //         _this.getList();
            //         _this.$bus.$emit('updateJxcDashboard');
            //     },
            // });
        },
        deleteConfirm(row) {
            const _this = this;
            if (row) {
                if (row.out_bill === 1 || row.out_bill === 2) {
                    _this.$message.error(`销售订单：${ row.code } 已经有部分出库或者全部出库，无法删除！`);
                    return;
                }
            } else {
                let filterList = _this.selectionList.filter(item => item.gen_finance === 1);
                if (_this.$utils.isNotEmptyList(filterList)) {
                    let codeList = filterList.map(item => item.code);
                    _this.$message.error(`销售订单：${ codeList.join('、') } 已生成对账，无法删除！`);
                    return;
                }
                filterList = _this.selectionList.filter(item => item.out_bill === 1 || item.out_bill === 2);
                if (_this.$utils.isNotEmptyList(filterList)) {
                    let codeList = filterList.map(item => item.code);
                    _this.$message.error(`销售订单：${ codeList.join('、') } 已经有部分出库或者全部出库，无法删除！`);
                    return;
                }
            }
            _this.storeDispatch('jxc/handleDeleteData', {
                url: _this.$api.API_DeleteJxcSaleOrders,
                row,
                list: _this.selectionList,
                _vm: _this,
                msg_name: '销售订单',
            }).then(res => {
                if (res) {
                    _this.getList();
                    _this.$bus.$emit('updateJxcDashboard');
                }
            });
        },
        changeAuditState(type) {
            const _this = this;
            let filterList = _this.selectionList.filter(item => item.gen_finance === 1);
            if (_this.$utils.isNotEmptyList(filterList)) {
                let codeList = filterList.map(item => item.code);
                _this.$message.error(`销售订单：${ codeList.join('、') } 已生成对账，无法${ type === 'audit' ? '审核' : '反审' }！`);
                return;
            }
            filterList = _this.selectionList.filter(item => item.out_bill === 1 || item.out_bill === 2);
            if (filterList && filterList.length > 0) {
                let codeList = filterList.map(item => item.code);
                _this.$message.error(`销售订单：${ codeList.join('、') } 已经有部分出库或者全部出库，无法${ type === 'audit' ? '审核' : '反审' }！`);
                return;
            }
            _this.storeDispatch('jxc/changeAuditState', {
                url: _this.$api.API_ChangeJxcSaleOrderAuditState,
                list: _this.selectionList,
                type,
                _vm: _this,
                msg_name: '销售订单',
            }).then(res => {
                if (res) {
                    _this.getList();
                }
            });
        },
        genOutBill() {
            const _this = this;
            if (!_this.$utils.isVersionAuthPath("/jxcStockOutBill")){
                return;
            }
            if (!_this.checkSelection(_this.selectionList, true)) {
                return;
            }
            let filterList = _this.selectionList.filter(item => item.audit_state === 0);
            if (_this.$utils.isNotEmptyList(filterList)) {
                let codeList = filterList.map(item => item.code);
                _this.$message.error(`销售订单：${ codeList.join('、') } 未审核，无法生成出库单！`);
                return;
            }
            filterList = _this.selectionList.filter(item => item.out_bill === 2);
            if (_this.$utils.isNotEmptyList(filterList)) {
                let codeList = filterList.map(item => item.code);
                _this.$message.error(`销售订单：${ codeList.join('、') } 已全部出库！`);
                return;
            }
            let sid_list = _this.selectionList.map(item => item.sid);
            _this.fetchData(_this.$api.API_GenJxcSaleOrder2OutBill, {
                sid_list,
            }).then(() => {
                _this.$message.success('生成出库单成功！');
                _this.getList();
            }).catch(() => {
            });
        },
        handleExportEvent(command) {
            const _this = this;
            let queryData = $.extend({}, _this.searchForm);
            queryData.dr = 0;
            queryData.with_detail = '1';
            let url = _this.$api.API_FindJxcSaleOrders;
            let outputName = '销售订单（含明细）';
            let templateName = _this.$api.EXPORT_TEMPLATE_NAME_SALE_ORDER_INCLUDE_DETAIL;
            if (command === 'noDetail') {
                outputName = '销售订单（不含明细）';
                templateName = _this.$api.EXPORT_TEMPLATE_NAME_SALE_ORDER_NO_DETAIL;
                delete queryData.with_detail;
            }
            if (command !== 'saleOrder') {
                poiApi.exportExcelTemplate(templateName, url, queryData, outputName, {}, undefined, 1, 100, false, true).then(() => {
                    return true;
                }).catch(() => {
                    return false;
                });
                return;
            }
            if (!_this.checkSelection(_this.selectionList)) {
                return;
            }
            _this.$ExportForm({
                method: 'exportExcelTemplateCustomNew',
                params: {
                    template_name: _this.$api.EXPORT_TEMPLATE_NAME_SALE_ORDER_CLOTHING,
                    url: _this.$api.API_GetJxcSaleOrderBySid,
                    params: {
                        sid: _this.selectionList[0].sid,
                        export: '1',
                    },
                    output_name: '销售单',
                    with_date: true,
                    col_foreach: true,
                },
                dialogOpt: {
                    title: '导出销售单',
                    formConfig: {
                        rules: {
                            company_name: [
                                { required: true, message: "请输入公司名称", trigger: "change" },
                            ],
                        },
                        labelWidth: '80px',
                        itemField: {
                            tip: null,
                            company_name: '公司名称',
                            linker_phone: '电话',
                            linker_address: '地址',
                        },
                        itemProps: {
                            tip: {
                                labelWidth: '0px',
                                style: {
                                    marginBottom: '5px',
                                },
                                widget: {
                                    name: 'ElAlert',
                                    style: {
                                        padding: '2px',
                                    },
                                    props: {
                                        title: '单据项预设值',
                                        closable: false,
                                        effect: 'dark',
                                    },
                                },
                            },
                        },
                    },
                },
            });
        },
        handlePrintEvent(command) {
            const _this = this;
            if (command === 'printTemplate') {
                _this.$router.push({
                    path: '/print/saleOrder',
                    query: {
                        name: '销售订单',
                    },
                });
                return;
            }
            if (command === 'printItem') {
                _this.$router.push({
                    path: '/printItem/saleOrder',
                    query: {
                        name: '销售订单',
                    },
                });
                return;
            }
            if (!_this.checkSelection(_this.selectionList, true)) {
                return;
            }
            _this.$PrintPreview({
                template: command.sid,
                data: _this.selectionList,
                fetch(data) {
                    return _this.fetchData(_this.$api.API_QueryJxcSaleOrderData4Print, {
                        sid_list: data.map(item => item.sid),
                    }).then(result => {
                        return result.data || [];
                    }).catch(() => {
                        return [];
                    });
                },
            });
        },
        openReceiveDialog(row) {
            const _this = this;
            _this.$dialog({
                title: '收款',
                width: '400px',
                component: {
                    value: ReceivePayForm,
                    props: {
                        type: 'sale',
                        row: {
                            order_sid: row.sid,
                            order_code: row.code,
                            name: row.client_display,
                            total_amount: row.should_receive_amount,
                            remain_amount: row.un_receive_amount,
                        },
                    },
                },
                confirmed() {
                    _this.getList();
                },
            });
        },
        openSale2BuyDialog() {
            const _this = this;
            if (!_this.checkSelection(_this.selectionList, true)) {
                return;
            }
            _this.$dialog({
                title: '以销定购',
                width: '1400px',
                component: {
                    value: BuyOrderForm,
                    props: {
                        type: 'sale2buy',
                        row: {
                            sale_order_list: _this.selectionList.map(item => item.sid),
                        },
                    },
                },
                confirmed() {
                    _this.getList();
                },
            });
        },
    },
}
</script>
